<script setup lang="ts">
import { LoginService } from '@/service/api/login'
import { Modal } from '@/plugins/Modal'
import { Navigate } from '@/utils'
import { useUserStore } from '@/store';
const loginForm = reactive({
  username: 'admin',
  password: 'admin123',
  captchaVerification: '',
  rememberMe: true, // 默认记录我。如果不需要，可手动修改
  tenantName: '芋道源码'
})

const codeUrl = ref('')
const captchaEnabled = ref(false)
const checked2 =  ref(false)
// 密码登录
const pwdLogin = async () => {
  await getTenantIdReq()
  const UserStore = useUserStore()
  const res = await UserStore.Login(loginForm).catch(err => {
    console.log(err)
  })
  // if(res.data.code != 0){
  //   console.log(err)
  // }else{
  //   Navigate.reLaunch('/pages/hkb/index/index')
  // }
  // Navigate.reLaunch('/pages/hkb/product/index')

}

// 获取租户 ID
const getTenantIdReq = async () => {
  const UserStore = useUserStore()
  await UserStore.getTenantIdByName(loginForm.tenantName)
}

// 获取图形验证码
// const getCode = async () => {
//   const res = await LoginService.getCodeImg()
//   codeUrl.value = `data:image/gif;base64,${res.data.img}`
//   loginForm.uuid = res.data.uuid
// }
// 登录方法
const handleLogin = async () => {
  if (loginForm.username === '') {
    Modal.msgError('请输入您的账号')
  } else if (loginForm.password === '') {
    Modal.msgError('请输入您的密码')
  } else if(checked2.value == false){
    Modal.msgError('请阅读并同意隐私条款')
  }else{
    Modal.loading('登录中，请耐心等待...')

    pwdLogin()
  }
}
// 隐私协议
const handleUserAgreement = () => {
  Navigate.to('/pages/common/webview/index')
}
// 用户协议
const handlePrivacy = () => {
  Navigate.to('/pages/common/webview/index')
}



onLoad(async () => {
  // getCode()
})

// UserService.getTask('/api/user/list')?.abort()
</script>

<template>
  <view class="normal-login-container">
    <view class="logo-content align-center justify-center flex">
      <!-- <image style="width: 100rpx;height: 100rpx;" :src="globalConfig.appInfo.logo" mode="widthFix">
            </image> -->
      <text class="title">
        会客宝移动端登录
      </text>
    </view>
    <view class="login-form-content">
      <view class="input-item flex align-center">
        <view class="iconfont icon-user icon" />
        <input v-model="loginForm.username" class="input" type="text" placeholder="请输入账号" maxlength="30">
      </view>
      <view class="input-item flex align-center">
        <view class="iconfont icon-password icon" />
        <input v-model="loginForm.password" type="password" class="input" placeholder="请输入密码" maxlength="20">
      </view>
      <!-- <view class="input-item flex align-center">
        <view class="iconfont icon-code icon" />
        <input v-model="loginForm.code" type="number" class="input" placeholder="请输入验证码" maxlength="4">
        <image :src="codeUrl" class="login-code-img" @click="getCode" />
      </view> -->
      <view class="xieyi text-center" style="margin-right: 65px;">
        <el-button type="primary" text @click="shareLink">手机验证码登录</el-button>
        <el-button type="primary" text @click="shareLink">重置密码</el-button>
      </view>

      <view class="xieyi text-center" style="margin-right: 20px;">
        <el-checkbox v-model="checked2">我已阅读并同意使用条款与隐私政策</el-checkbox>
      </view>

      <view class="action-btn">
        <button class="login-btn text-white bg-blue " @click="handleLogin">
          登录
        </button>
      </view>
    </view>

  </view>
</template>

<style lang="scss" scoped>
page {
  background-color: #ffffff;
}

uni-page-body {
  height: 100%;
}

.normal-login-container {
  width: 100%;
  height: 100%;

  .logo-content {
    width: 100%;
    font-size: 21px;
    text-align: center;
    padding-top: 15%;

    image {
      border-radius: 4px;
    }

    .title {
      margin-left: 10px;
    }
  }

  .login-form-content {
    text-align: center;
    margin: 15% auto 20px;
    width: 80%;

    .input-item {
      margin: 20px auto;
      background-color: #f5f6f7;
      height: 45px;
      line-height: 45px;
      border-radius: 20px;

      .icon {
        font-size: 38 rpx;
        margin-left: 10px;
        color: #999;
      }

      .input {
        width: 100%;
        height: 100%;
        font-size: 14px;
        line-height: 45px;
        text-align: left;
        padding-left: 15px;
      }

    }

    .login-btn {
      width: 260px;
      margin-top: 40px;
      height: 45px;
    }

    .xieyi {
      color: #333;
      margin-top: 20px;
    }
  }

  .easyinput {
    width: 100%;
  }
}

.login-code-img {
  height: 45px;
}
</style>
